<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:a4j="http://richfaces.org/a4j"
	template="../templates/templateAnalistaDesarrollador.xhtml">

	<ui:define name="body">
		<h:form>
			<table width="100%">
				<tr>
					<td align="left">
						<h2>
							<h:outputText value="Inicio" />
						</h2>
					</td>
				</tr>
				<tr>
					<td align="left"><f:view encoding="iso-8859-1">

							<rich:panel height="400">
								<f:facet name="header">
        		Tickets en atención
        		</f:facet>
								<!--  -->
								<h:outputText value="#{atenderTicketAction.recuperar_ticketsEA}" />

								<rich:dataTable id="tabla" rows="10" border="1"
									style="width: 100%; "
									value="#{atenderTicketAction.lista_tickets_en_atencion}"
									var="data"
									binding="#{atenderTicketAction.radioDataTableTicketEA}"
									reRender="scTabla"
									onRowMouseOver="this.style.backgroundColor='#F1F1F1'"
									onRowMouseOut="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'">
									<f:facet name="header">
										<rich:datascroller id="scTabla" for="tabla"
											selectedStyle="font-weight:bold" align="center" />
									</f:facet>

									<rich:column sortBy="#{data.idTicket}" width="30px;">
										<f:facet name="header">
											<h:outputText value="N° Ticket" />
										</f:facet>
										<div align="left">
											<h:outputText value="#{data.idTicket}" />
										</div>
									</rich:column>

									<rich:column sortBy="#{data.tipoTicket}" width="30px;">
										<f:facet name="header">
											<h:outputText value="Tipo" />
										</f:facet>
										<div align="left">
											<h:outputText value="#{data.tipoTicket}" />
										</div>
									</rich:column>

									<rich:column sortBy="#{data.descripcionCorta}" width="80px;">
										<f:facet name="header">
											<h:outputText value="Descripcion" />
										</f:facet>
										<div align="left">
											<h:outputText value="#{data.descripcionCorta}" />
										</div>
									</rich:column>

									<rich:column sortBy="#{data.fecha}" width="30px;">
										<f:facet name="header">
											<h:outputText value="Fecha Registro" />
										</f:facet>
										<div align="left">
											<h:outputText value="#{data.fecha}" />
										</div>
									</rich:column>

									<rich:column sortBy="#{data.nombreSistema}" width="50px;">
										<f:facet name="header">
											<h:outputText value="Sistema" />
										</f:facet>
										<div align="left">
											<h:outputText value="#{data.nombreSistema}" />
										</div>
									</rich:column>
									<!-- CAMBIAR ESTO. PONER PARA SELECIONAR UNA FILA -->
									<rich:column width="20px;">
										<f:facet name="header">
											<h:outputText value="Seleccionar" />
										</f:facet>

										<!--  -->
										<rich:modalPanel id="panel" width="350" height="100">
											<f:facet name="header">
												<h:panelGroup>
													<h:outputText value="Ticket"></h:outputText>
												</h:panelGroup>
											</f:facet>
											<f:facet name="controls">
												<h:panelGroup>
													<h:graphicImage value="../images/close.png"
														styleClass="hidelink" id="hidelink" />
													<rich:componentControl for="panel" attachTo="hidelink"
														operation="hide" event="onclick" />
												</h:panelGroup>
											</f:facet>
											<!-- 1 -->
											<h:panelGrid columns="3">
												<h:outputLabel value="N° Ticekt" style="width:200px;" />
												<rich:spacer width="10px" height="30px" />
												<h:outputLabel value="#{data.idTicket}" style="width:200px;" />

												<h:outputLabel value="Tipo ticket" style="width:200px;" />
												<rich:spacer width="10px" height="30px" />
												<h:outputLabel value="#{data.tipoTicket}"
													style="width:200px;" />

												<h:outputLabel value="Descripcion corta"
													style="width:200px;" />
												<rich:spacer width="10px" height="30px" />
												<h:outputLabel value="#{data.descripcionCorta}"
													style="width:200px;" />

												<h:outputLabel value="Fecha de registro"
													style="width:200px;" />
												<rich:spacer width="10px" height="30px" />
												<h:outputLabel value="#{data.fecha}" style="width:200px;" />

												<h:outputLabel value="Sistema:" style="width:200px;" />
												<rich:spacer width="10px" height="30px" />
												<h:outputLabel value="#{data.nombreSistema}"
													style="width:200px;" />

												<h:outputLabel value="Descripcion:" style="width:200px;" />
												<rich:spacer width="10px" height="30px" />
												<h:outputLabel value="#{data.descripcionLarga}"
													style="width:200px;" />
											</h:panelGrid>
											<!-- 1 -->
										</rich:modalPanel>
										<h:outputLink value="#" id="link">
        								Ver
        								<rich:componentControl for="panel" attachTo="link"
												operation="show" event="onclick" />
										</h:outputLink>
										<!--  -->

									</rich:column>



									<f:facet name="footer">
										<rich:columnGroup id="groupColumnResultadoEncontrado"
											styleClass="footerTable">
											<rich:column colspan="6">
												<h:panelGrid id="regEncon">
													<h:outputText id="txtRegEncon" value="lEO :)"
														styleClass="footerTableText" />
												</h:panelGrid>
											</rich:column>
										</rich:columnGroup>
									</f:facet>
								</rich:dataTable>

								<!--  -->
							</rich:panel>
						</f:view></td>
				</tr>

				<tr>
					<td><rich:spacer width="10px" style="height: 22px; " /></td>
				</tr>

				<tr>
					<td align="center"><h:panelGrid columns="3"
							style="width:150px;">
							<h:commandButton value="Limpiar"
								style="height: 37px; width: 137px; " />
							<rich:spacer width="10px" height="30px" />
							<h:commandButton value="Registrar"
								action="#{usuarioAction.registrar}"
								style="height: 37px; width: 137px; " />
						</h:panelGrid></td>
				</tr>
			</table>
		</h:form>
	</ui:define>
</ui:composition>